<template>
	<section style="width:100%">
		<section>
			<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
				<el-form :inline="true" >
					<el-form-item>
						<el-input v-model="userId" placeholder="玩家ID"></el-input>
					</el-form-item>
					<el-form-item label="登录开始时间">
						<el-date-picker
								v-model="loginStart"
								type="datetime"
								value-format="yyyy-MM-dd HH:mm:ss"
								placeholder="选择日期">
						</el-date-picker>
					</el-form-item>
					<el-form-item label="登录结束时间">
						<el-date-picker
								v-model="loginEnd"
								type="datetime"
								value-format="yyyy-MM-dd HH:mm:ss"
								placeholder="选择日期">
						</el-date-picker>
					</el-form-item>
					<!--<el-form-item label="控制状态">-->
						<!--<el-select v-model="roomValue" placeholder="请选择">-->
							<!--<el-option-->
									<!--v-for="item in room"-->
									<!--:key="item.value"-->
									<!--:label="item.label"-->
									<!--:value="item.value">-->
							<!--</el-option>-->
						<!--</el-select>-->
					<!--</el-form-item>-->
					<!--<el-form-item>-->
						<!--<el-input v-model="filters.name" placeholder="游戏平台"></el-input>-->
					<!--</el-form-item>-->
					<el-form-item>
						<el-button type="primary" v-on:click="getUsers(pageSize)">查询</el-button>
					</el-form-item>
				</el-form>
				<!--<el-form :inline="true">-->
					<!--<el-form-item label="总人数">-->
						<!--<label>213212999999</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="金币数">-->
						<!--<label>213212999999</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="奖励点">-->
						<!--<label>12123121231</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="充值">-->
						<!--<label>54351321</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="提现">-->
						<!--<label>2312121321</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="总赠送金币">-->
						<!--<label>0.99999</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="总接收金币">-->
						<!--<label>454545</label>-->
					<!--</el-form-item>-->
					<!--<el-form-item label="总输赢">-->
						<!--<label>45454</label>-->
					<!--</el-form-item>-->
				<!--</el-form>-->
			</el-col>
			<!--列表-->
			<el-table :data="users" stripe highlight-current-row v-loading="listLoading" style="width: 100%;"  :default-sort = "{prop: 'loginTime', order: 'descending'}">
				<!--<el-table-column type="selection" width="55">-->
				<!--</el-table-column>-->
				<el-table-column prop="id" label="玩家ID" width="120" sortable>
				</el-table-column>
				<el-table-column prop="nickname" label="玩家昵称" width="200">
				</el-table-column>
				<el-table-column prop="registerTime" label="注册时间" width="180" sortable>
				</el-table-column>
				<el-table-column prop="loginTime" label="登录时间" width="180" sortable>
				</el-table-column>
				<el-table-column prop="winlose" label="总输赢" width="150">
					<template slot-scope="scope">
						<span v-if="scope.row.winlose">{{scope.row.winlose}}</span>
						<el-button type="text" size="small" v-else  @click="showWin(scope.row,scope.$index)">显示</el-button>
					</template>
				</el-table-column>
				<el-table-column prop="todaywinlose" label="当日输赢" width="150">
					<template slot-scope="scope">
						<span v-if="scope.row.todaywinlose">{{scope.row.todaywinlose}}</span>
						<el-button type="text" size="small" v-else @click="showTodaywin(scope.row,scope.$index)">显示</el-button>
					</template>
				</el-table-column>
				<el-table-column prop="amount" label="金币数"  min-width="130">
					<template slot-scope="scope">
						<span v-if="scope.row.amount">{{scope.row.amount | division}}</span>
						<span v-else>0.00</span>
					</template>
				</el-table-column>
				<el-table-column prop="integralamount" label="奖励点数"  min-width="150">
				</el-table-column>
				<el-table-column prop="currentgame" label="当前位置"  min-width="200">

				</el-table-column>
				<el-table-column prop="chargecount" label="充值次数" width="100">
				</el-table-column>
				<el-table-column prop="chargeamount" label="充值金额" width="100">
				</el-table-column>
				<el-table-column prop="withdrawlamount" label="提现金额" width="100">
					<template slot-scope="scope">
						<span v-if="scope.row.withdrawlamount">{{scope.row.withdrawlamount | division}}</span>
					</template>
				</el-table-column>

			</el-table>

			<!--工具条-->
			<el-col :span="24" class="toolbar">
				<el-pagination layout="sizes, total, prev, pager, next" :page-sizes="[15, 30, 50]" @current-change="handleCurrentChange" @size-change="handleSizeChange"  :page-size="pageSize" :total="total" style="float:right;">
				</el-pagination>
			</el-col>

		</section>
	</section>
</template>

<script>
	import base64 from '../../api/base64'

	export default {
		data() {
			return {
                userId:'',
                registerStart:'',
                registerEnd:'',
                loginStart:'',
                loginEnd:'',
                listLoading:false,
                users:[],
                total:0,
				page:1,
				pageSize:15
			}
		},
		methods: {
            downAgent(){
                this.$router.push({path:'/agent/member'})
			},
            handleSizeChange(val) {
                this.pageSize = val
                this.getUsers(this.pageSize);
            },
			handleCurrentChange(val) {
				this.page = val;
				this.getUsers(this.pageSize);
			},
			//获取用户列表
			getUsers(page) {
                this.listLoading = true;
                // let registerStart = Date.parse(new Date(this.registerStart))
                // let registerEnd = Date.parse(new Date(this.registerEnd))
                let loginStart,loginEnd
                if (this.loginStart || this.loginEnd){
                    loginStart = Date.parse(new Date(this.loginStart))
                    loginEnd = Date.parse(new Date(this.loginEnd))
                }else{
                    loginStart = ''
                    loginEnd =''
                }
                this.$axios.get('/online-users?userid='+this.userId+'&index='+this.page+'&size='+page+'&lastloginatstart='+loginStart+'&lastloginatend='+loginEnd,{},this.global().token).then((res)=>{
                    if (res.status == 200){
                        this.total = res.data.count
                        let userTable = res.data.data
                        let base = new base64.Base64()
                        userTable.forEach((val)=>{
                            if (val.nickname){
                                val.nickname =  base.decode(val.nickname)
							}
                            val.registerTime = this.changeDate(val.registerat)
                            val.loginTime = this.changeDate(val.lastloginat)
                        })
                        this.users = userTable
                        this.listLoading = false
                    }else{
                        this.$message({message: res.data, type: 'error'});
                        this.listLoading = false
                    }
                })
			},
            showWin(row){
                this.$axios.get('/user/'+row.id+'/all-winlose',{},this.global().token).then((res)=>{
                    if(res.status == 200){
                        // this.users[index].winlose = (parseFloat(res.data)/1000).toFixed(2)
                        row.winlose = (parseFloat(res.data)/1000).toFixed(2)
                    }
                })
                console.log(this.users)
            },
            showTodaywin(row){
                this.$axios.get('/user/'+row.id+'/winlose',{},this.global().token).then((res)=>{
                    if(res.status == 200){
                        row.todaywinlose =  (parseFloat(res.data)/1000).toFixed(2)
                    }
                })
            }
		},
		mounted() {
			this.getUsers(this.pageSize);
		}
	}

</script>

<style scoped lang="stylus">
	.agent-path
		display flex
		padding-bottom 10px
		&>p
			padding-right 10px
		&>h3
			cursor pointer
</style>